import React, {Component, PropTypes} from 'react';
import {Menu, Icon, Switch, Card} from 'antd';
const SubMenu = Menu.SubMenu;

function strSub(str) {
  if (str != null) {
    if (str.length > 28) {
      return str.substring(0, 28) + "...";
    } else {
      return str;
    }
  }
}


class MenuListContainer extends Component {
  constructor(props) {
    super(props);
    this.state = {
      current: 'list',
      data: [],
    };
  }

  handleClick(e) {
    this.setState({
      current: e.key,
    });
    this.props.listSignal.dispatch(e.key);
  }

  updateData(listData) {
    var oldData = this.state.data;
    for (var d in oldData) {
      if (listData.id == oldData[d].id) {
        oldData[d].comment = listData.comment;
      }
    }
    this.setState(
      {
        data: oldData
      }
    )
  }

  render() {
    const loop = data => data.map((item) => {
      return <Menu.Item key={item.id}>
        <h5><Icon type="file-text"/>{strSub(item.name)}</h5>
        <h6>{strSub(item.comment)}</h6>
      </Menu.Item>
    });
    const items = loop(this.state.data);

    return (
        <Menu onClick={this.handleClick.bind(this)}
              style={{width: '100%', height: '800px'}}
              defaultOpenKeys={['list']}
              selectedKeys={[this.state.current]}
              mode="inline"
              scroll={{ y: 240 }}
        >
          <SubMenu key="list" title={<span>内容列表</span>}>
            {items}
          </SubMenu>

        </Menu>

    );
  }
}

export default MenuListContainer;
